/* 应用通用样式控制，业务开发请移步 src/style/common.less，方便版本升级 */
:root {
  /* 这里的变量仅用于定义变量名，应用会根据实际数据覆盖变量值，所以请勿修改这里的数据 */
  // 主题色
  --app-color-primary: @app-color-primary;
  --app-color-primary-1: @app-color-primary-1;
  --app-color-primary-2: @app-color-primary-2;
  --app-color-primary-3: @app-color-primary-3;
  --app-color-primary-4: @app-color-primary-4;
  --app-color-primary-5: @app-color-primary-5;
  --app-color-primary-6: @app-color-primary-6;
  --app-color-primary-7: @app-color-primary-7;
  --app-color-primary-8: @app-color-primary-8;
  --app-color-primary-9: @app-color-primary-9;
  --app-color-primary-10: @app-color-primary-10;
  --app-color-text-primary: @app-color-text-primary;
  --app-color-text-secondary: @app-color-text-secondary;
  --app-color-placeholder: @app-color-placeholder;
  --app-color-bg-primary: @app-color-bg-primary;
  --app-color-bg-secondary: @app-color-bg-secondary;
  --app-color-bd-primary: var(--td-component-border);
  // 字体大小
  --app-font-size: @app-font-size-default;
  // 组件高度
  --app-height-component: @app-height-component-default;
  // 垂直间距
  --app-space-vertical: @app-space-vertical-default;
  // 水平间距
  --app-space-horizontal: @app-space-horizontal-default;
  // 圆角
  --app-border-radius-s: calc(var(--app-border-radius) * 0.875);
  --app-border-radius: 5px;
  --app-border-radius-l: calc(var(--app-border-radius) * 1.125);
  // 左侧菜单栏
  --app-aside-width: 0px;
  --app-aside-height: 0px;
  // 页头
  --app-header-width: 0px;
  --app-header-height: 0px;
  // tabs区域
  --app-tabs-width: 0px;
  --app-tabs-height: 0px;
  // 内容区域
  --app-main-width: 0px;
  --app-main-height: 0px;
  // 页脚
  --app-footer-width: 0px;
  --app-footer-height: 0px;

  /* ==== 以下是计算变量，基于基础变量得出 ================================ */
  // 间距
  --app-space: var(--app-space-vertical) var(--app-space-horizontal);
  // 参考缩放比例
  --app-scale: calc(var(--app-font-size) / @app-font-size-default);
  // 内容区域可见高宽
  --app-main-visible-width: calc(var(--app-main-width) - var(--app-space-horizontal) * 2);
  --app-main-visible-height: calc(var(--app-main-height) - var(--app-footer-height) - var(--app-space-vertical) * 2);
  // 内容可用高宽（内容高宽 - 内边距）
  --app-main-available-width: calc(var(--app-main-width) - var(--app-space-horizontal) * 2);
  --app-main-available-height: calc(var(--app-main-height) - var(--app-space-vertical) * 2);

  // 覆盖 ui 框架变量
  --td-radius-small: var(--app-border-radius-s);
  --td-radius-default: var(--app-border-radius);
  --td-radius-medium: var(--app-border-radius-l);
  --td-comp-size-s: calc(var(--app-height-component) * 0.875);
  --td-comp-size-m: var(--app-height-component);
  --td-comp-size-l: calc(var(--app-height-component) * 1.125);
  --td-comp-paddingTB-s: calc(var(--app-space-vertical) * 0.875);
  --td-comp-paddingTB-m: var(--app-space-vertical);
  --td-comp-paddingTB-l: calc(var(--app-space-vertical) * 1.125);
  --td-comp-paddingLR-s: calc(var(--app-space-horizontal) * 0.875);
  --td-comp-paddingLR-m: var(--app-space-horizontal);
  --td-comp-paddingLR-l: calc(var(--app-space-horizontal) * 1.125);
  --td-comp-margin-s: calc(var(--app-space-horizontal) * 0.875);
  --td-comp-margin-m: var(--app-space-horizontal);
  --td-comp-margin-l: calc(var(--app-space-horizontal) * 1.125);

}

/* 小间距、小字号 */
html[app-space=small] {
  --app-font-size: @app-font-size-small;
  --app-height-component: @app-height-component-small;
}

/* 默认间距、默认字号 */
html[app-space=default] {
  --app-font-size: @app-font-size-default;
  --app-height-component: @app-height-component-default;
}

/* 大间距、大字体 */
html[app-space=large] {
  --app-font-size: @app-font-size-large;
  --app-height-component: @app-height-component-large;
}

/* 色弱模式 */
html[app-color-weak=true] {
  filter: invert(80%);
}

/* 暗黑模式 */
html[app-theme-mode=dark]{

}

/* 通用样式属性 */
body {

}

.app-content {
  display: flex;
  flex-direction: column;
}

.app-page-wh {
  height: var(--app-main-visible-height);
  width: var(--app-main-visible-width);
}
.app-page-bg {
  background: var(--app-color-bg-primary);
}
.app-page-br {
  border-radius: var(--app-border-radius);
}
.app-page-pd{
  padding: var(--app-space);
}
.app-page {
  height: var(--app-main-visible-height);
  width: var(--app-main-visible-width);
  background: var(--app-color-bg-primary);
  border-radius: var(--app-border-radius);
  padding: var(--app-space);
  margin: var(--app-space);
}
.app-page-scroll {
  height: var(--app-main-visible-height);
  width: var(--app-main-visible-width);
  overflow-y: auto;
  margin: var(--app-space);
}
.app-page-scroll-y {
  height: var(--app-main-visible-height);
  width: var(--app-main-visible-width);
  overflow-y: auto;
  overflow-x: hidden;
  margin: var(--app-space);
}
.app-page-split {
  height: var(--app-main-visible-height);
  width: var(--app-main-visible-width);
  display: flex;
  margin: var(--app-space);
  >:nth-child(n) {
    height: 100%;
    margin-right: var(--app-space-horizontal);
    background: var(--app-color-bg-primary);
    overflow-y: auto;
    padding: var(--app-space);
  }
  >:last-child {
    margin-right: 0;
  }
}

/* 指令名称定义（仅用于代码提示） */
[v-loading], // 加载中指令
[v-has], // 权限控制指令
[v-disabled], // 禁用指令
[v-onresize], // 监听元素宽高变化指令
[v-grid], // 自动布局指令
[v-focus], // 自动获取焦点指令
[v-activity], // 元素获取、失去焦点监听指令
[v-ellipsis],
[v-onRightClick],
[lg-position] {}

.lg-modal {
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  .t-dialog--default {
    padding: var(--app-space);
  }
}
.lg-modal.t-dialog__ctx--modeless {
  pointer-events: unset !important;
  .t-dialog__wrap{
    background: var(--td-mask-active);
  }
}

.lg-form .t-input-number.t-is-controls-right {
  width: 100%;
}
